<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<style type="text/css">
	.pagediv {
		height: 50px;
		padding: 10px 15px 5px 0px;
		text-align:center;
		clear: both;
	}
	.pagediv a {
		margin-left:2px;
		margin-right:3px;
		padding-left:5px;
		padding-right:5px;
		padding-top:5px;
		padding-bottom:5px;
		text-align: center;
		border: 1px solid  #CCC;
		color:rgb(51,102,153);
		font-weight:bold;
	}
	a:hover {
		text-decoration: none;
	}
	.thispage {
		font-size:13px;
		color: #F00;
		margin: 0px 1px;
		padding-left:5px;
		padding-right:5px;
		padding-top:5px;
		padding-bottom:5px;
		text-align: center;
	}
	.break {
		margin-left:2px;
		margin-right:3px;
		padding-left:5px;
		padding-right:5px;
		padding-top:5px;
		padding-bottom:5px;
		text-align: center;
		border: 1px solid  #CCC;
		color:rgb(51,102,153);
		font-weight:bold;
	}
	.prev {
		font-size:13px;
		color:#CCC;
		margin: 0px 1px;
		padding-left:5px;
		padding-right:5px;
		margin-right:10px;
		padding-top:5px;
		padding-bottom:5px;
		text-align: center;
		border: 1px solid  #CCC;
	}
	.prev a {
		font-size:13px;
		color:rgb(51,102,153);
		padding-left:5px;
		padding-right:5px;
		padding-top:5px;
		padding-bottom:5px;
		text-align: center;
		border: 1px solid  #CCC;
	}
	
</style>
<div id="pagebar" class="paginator">
	<form>
		<input type="hidden" id="pageSize" value="${pages.pageSize}" /> <input
			type="hidden" id="totalPage" value="${pages.totalPage }" /> <input
			type="hidden" id="totalRecords" value="${pages.totalRecords}" /> <input
			type="hidden" id="url" value="${pages.url}" />
	</form>
	<script type="text/javascript">
	function QueryString(item){
		var sValue=location.search.match(new RegExp("[\?\&]"+item+"=([^\&]*)(\&?)","i"));
		return sValue?sValue[1]:sValue;
	}
	var perpage = document.getElementById("pageSize").value;
	var pagecount = document.getElementById("totalPage").value;
	var count = document.getElementById("totalRecords").value;
	var url = document.getElementById("url").value;
	var currentpage = QueryString("page");
	if (currentpage==null){
		currentpage = 1;
	}else{
		currentpage = parseInt(currentpage);
	}
	
	if(pagecount == 0) {
		pagecount = 1;
	}
	
	var pagestr = "";
	var breakpage = 9;
	var currentposition = 4;
	var breakspace = 2;
	var maxspace = 4;
	var prevnum = currentpage-currentposition;
	var nextnum = currentpage+currentposition;
	if(prevnum<1) prevnum = 1;
	if(nextnum>pagecount) nextnum = pagecount;
	pagestr += (currentpage==1)?'<div class="pagediv"><a class="prev">前页</a>':'<div class="pagediv"><a  class="prev" href="'+ url +'page='+(currentpage-1)+'"><前页</a>';

	if(prevnum-breakspace>maxspace){
		
		for(var i=1;i<=breakspace;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}	
		pagestr += '<span class="break">...</span>';
		
		for(var i=pagecount-breakpage+1;i<prevnum;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}
			
	}else{

		for(var i=1;i<prevnum;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}
			
	}

	for(var i=prevnum;i<=nextnum;i++){
		pagestr += (currentpage==i)?'<span class="thispage">'+i+'</span>':'<a href="'+ url +'page='+i+'">'+i+'</a>';
	}
	if(pagecount-breakspace-nextnum+1>maxspace){
		
		for(var i=nextnum+1;i<=breakpage;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}
			
		pagestr += '<span class="break">...</span>';

		for(var i=pagecount-breakspace+1;i<=pagecount;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}	
	}else{

		for(var i=nextnum+1;i<=pagecount;i++) {
			pagestr += '<a href="'+ url +'page='+i+'">'+i+'</a>';
		}		
	}
	pagestr += (currentpage==pagecount)?'<a class="prev">后页 </a></div>':'<a class="prev" href="'+ url +'page='+(currentpage+1)+'">后页></a></div>';
	document.getElementById("pagebar").innerHTML = pagestr;
</script>
</div>